<!--通知管理-->
<template>
  <div>
    <div>
      <el-form :inline="true" :model="requestData" style="width: 100%;margin-bottom: 10px;">
        <el-form-item label="开始时间">
            <el-date-picker size="mini"
              v-model="requestData.map.n_start_time"
              type="datetime"
              placeholder="选择日期时间"
              value-format="yyyy-MM-dd HH:mm:ss">
            </el-date-picker>
        </el-form-item>
        <el-form-item label="结束时间">
          <el-date-picker size="mini"
                          v-model="requestData.map.n_end_time"
                          type="datetime"
                          placeholder="选择日期时间"
                          value-format="yyyy-MM-dd HH:mm:ss">
          </el-date-picker>
        </el-form-item>
        <el-form-item>
          <el-button size="mini" @click="resetSearchNotice">重置</el-button>
          <el-button size="mini" type="success" icon="el-icon-search" @click="searchNotice">查询</el-button>
          <el-button size="mini" type="primary" icon="el-icon-circle-plus" @click="addNotice">添加</el-button>
          <el-button size="mini" type="danger" icon="el-icon-delete" @click="deleteNotice">删除</el-button>
          <el-button size="mini" type="danger" icon="el-icon-delete" @click="deleteAllUnStartNotice">未开始通知</el-button>
          <el-button size="mini" type="danger" icon="el-icon-delete" @click="deleteAllStartedNotice">已结束通知</el-button>
        </el-form-item>
      </el-form>
    </div>
    <el-table
      :data="tableData"
      stripe
      @selection-change="handleSelectionChange"
      style="width: 100%">
      <!--<el-table-column type="expand">-->
        <!--<template slot-scope="props">-->
          <!--<el-form label-position="left" inline class="demo-table-expand">-->
            <!--<el-form-item label="内容">-->
              <!--<span>{{ props.row.n_content }}</span>-->
            <!--</el-form-item>-->
          <!--</el-form>-->
        <!--</template>-->
      <!--</el-table-column>-->
      <el-table-column
        align="center"
        type="selection"
        width="80">
      </el-table-column>
      <el-table-column
        align="center"
        type="index"
        width="80">
      </el-table-column>s
      <!--<el-table-column-->
        <!--align="center"-->
        <!--label="标题"-->
        <!--prop="n_title">-->
      <!--</el-table-column>-->
      <el-table-column
        align="center"
        label="内容"
        prop="n_content"
      minWidth="200px">
      </el-table-column>
      <el-table-column
        align="center"
        label="开始时间"
        prop="n_start_time">
      </el-table-column>
      <el-table-column
        align="center"
        label="结束时间"
        prop="n_end_time">
      </el-table-column>
      <el-table-column
        align="center"
        label="状态"
        prop="statusInfo">
      </el-table-column>
      <el-table-column
        label="操作"
        align="center">
        <template slot-scope="scope">
          <el-button size="mini"  @click="editNotice(scope.$index, scope.row)">编辑</el-button>
          <el-button type="danger" icon="el-icon-delete"  size="mini" @click="deleteNoticeById(scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="pageInfo.page"
      :page-sizes="[10, 20, 30, 40,50]"
      :page-size="pageInfo.size"
      layout="total, sizes, prev, pager, next, jumper"
      :total="pageInfo.total">
    </el-pagination>
    <add-notice-info v-if="isShowAdd" :isShowAdd="isShowAdd" @closeDialog="closeDialog"></add-notice-info>
    <edit-notice-info v-if="isShowEdit" :isShowEdit="isShowEdit" :row="row" @closeDialog="closeDialog"></edit-notice-info>
  </div>
</template>
<script>
import {addNotice,deleteNotices,updateNoticeById,findNoticeByPage,queryNoticeNowTime,deleteUnStartNotice,deleteStretedNotice} from '@/api/system'

import addNoticeInfo from './component/addNotice.vue'
import editNoticeInfo from  './component/editNotice.vue'
  export default{
    components:{
      addNoticeInfo,
      editNoticeInfo
    },
    created(){
        this.getAllNoticeInfo();
    },

    data(){
      return {
        tableData:[],
        selectList:[],
        row:null,
        isShowAdd:false,
        isShowEdit:false,
        pageInfo:{
          page:1,//页数
          size:10, //页面大小
          total:0 //页总数
        },
        requestData:{
          pageSize:10,
          pageNum:1,
          map:{
            n_start_time:'',
            n_end_time:''
          }
        }
      }
    },

    methods:{
      handleSelectionChange(val){
          this.selectList = val;
      },

      resetSearchNotice(){
        this.requestData.map.n_start_time = '';
        this.requestData.map.n_end_time = '';
        this.requestData.pageNum = 1;
        this.pageInfo.page = 1;
        this.getAllNoticeInfo();
      },

      getAllNoticeInfo(){
        this.tableData = [];
        findNoticeByPage(this.requestData).then(res=>{
            if(res.code == 200){
               this.tableData = res.data.data;
               for(let obj of  this.tableData){
                   if(obj.status == -1){
                       obj.statusInfo = "已结束"
                   }else if(obj.status == 0){
                       obj.statusInfo = "未开始"
                   }else{
                       obj.statusInfo = "通知中"
                   }
               }
               this.pageInfo.total = res.data.total;
            }
        })
      },

      searchNotice(){
        this.getAllNoticeInfo();
      },

      addNotice(){
         this.isShowAdd = true
      },

      editNotice(index,row){
          this.row = row;
          this.isShowEdit = true;
      },

      deleteNoticeById(row){
        this.selectList = [row];
        this.deleteNotice();
      },


      deleteAllUnStartNotice(){
        this.$confirm('此操作将删除所有未开始的通知信息, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          deleteUnStartNotice().then(res=>{
            if(res.code == 200){
              this.$message({
                message: '删除成功',
                type: 'success'
              });
              this.selectList = [];
              this.getAllNoticeInfo();
            }
          })
        }).catch(() => {

        });
      },

      deleteAllStartedNotice(){
        this.$confirm('此操作将删除所有已结束的通知信息, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          deleteStretedNotice().then(res=>{
            if(res.code == 200){
              this.$message({
                message: '删除成功',
                type: 'success'
              });
              this.selectList = [];
              this.getAllNoticeInfo();
            }
          })
        }).catch(() => {

        });
      },

      deleteNotice(){
        if(this.selectList == null || this.selectList.length <= 0){
          this.$message({
            type: 'warning',
            message: '请至少选择一行要删除的数据'
          });
        }else{
          this.$confirm('此操作将删除该条数据, 是否继续?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            deleteNotices(this.selectList).then(res=>{
              if(res.code == 200){
                this.$message({
                  message: '删除成功',
                  type: 'success'
                });
                this.selectList = [];
                this.getAllNoticeInfo();
              }
            })
          }).catch(() => {

          });
        }
      },

      closeDialog(type){
          if(type == "add"){
            this.isShowAdd = false;
          }else{
              this.isShowEdit = false;
          }

          this.getAllNoticeInfo();
      },

      //每页的条数发生改变时调用
      handleSizeChange(size){
        this.requestData.pageSize = size;
        this.pageInfo.size = size;
        this.getAllNoticeInfo();
      },

      //页数发生改变时调用
      handleCurrentChange(page){
        this.requestData.pageNum = page;
        this.pageInfo.page = page;
        this.getAllNoticeInfo();
      },

    }
  }
</script>
